<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ include file="/view/common/header.jsp"%> 
<script type="text/javascript" src="${ctx}/resources/js/roleManage.js"></script>
</head>

<style type="text/css">
       #fm{
           margin:0;
           padding:10px 30px;
       }
       .ftitle{
           font-size:14px;
           font-weight:bold;
           padding:5px 0;
           margin-bottom:10px;
           border-bottom:1px solid #ccc;
       }
       .fitem{
           margin-bottom:5px;
       }
       .fitem label{
           display:inline-block;
           width:80px;
       }
       .fitem input{
           width:160px;
           vertical-align: middle;
       }
       
       .checkboxitem{
       	    margin-bottom: 10px;
    		margin-right: 10px;
       }
       .checkboxitem label{
       		display:inline-block;
       }
       .checkboxitem input{
       		width:20px !important;
       		vertical-align: middle;
       }
       .hbox{
       		float: left;
       }
       .hbox div{
       		float: left;
       }
       
</style>

<body style="margin:1px;">
	<!-- 工具栏  -->
	<div id="tb">
	<form id="searchfm" >
		<div>
			<a href="javascript:openAddDialog()" class="easyui-linkbutton" iconCls="icon-add" plain="true">新增</a>
			<a href="javascript:openModifyDialog()" class="easyui-linkbutton" iconCls="icon-edit" plain="true">修改</a>
			<a href="javascript:disableRoles()" class="easyui-linkbutton" iconCls="icon-remove" plain="true">删除</a>
		</div>
	 
		<div>
			&nbsp;角色编码：&nbsp;<input type="text" id="roleName" size="20"  /> &nbsp;
			&nbsp;角色名称：&nbsp;<input type="text" id="description"  size="20" />&nbsp;
			<a href="javascript:commonSearch()" class="easyui-linkbutton" iconCls="icon-search" plain="true">搜索</a>
		    <a href="javascript:resetSearchForm()" class="easyui-linkbutton" iconCls="icon-arrow_undo" plain="true">重置</a>
		</div>
	 </form>	
	</div>
	
	<!-- 查询表单 --> 
	<table id="dg" title="角色管理" class="easyui-datagrid"  pagination="true" rownumbers="true"  fit="true"  url="${ctx}/role/queryRolePage.do"  toolbar="#tb">
		 <thead>
				<tr>
					<th field="cb" checkbox="true" align="center"></th>
			 		<th field="id" width="50" align="center" hidden="true">编号</th>
			 		<th field="resource_ids" width="500" hidden="true" align="center">权限ids</th>
			 		
			 		<th field="role" width="150" align="center">角色编码</th>
			 		<th field="description" width="200" align="center">角色名称</th>
<!-- 			 		<th field="status" width="200" align="center" data-options="formatter:statusFormatter">状态</th> -->
			 		<th field="resource_names" width="500" align="center">拥有权限</th>
			 		
				</tr>
		</thead>
	</table>
	
	
	<!-- 弹出对话框 -->
	<div id="dlg" class="easyui-dialog" style="width: 700px;height:320px;padding: 10px 20px" closed="true" buttons="#dlg-buttons">
		<form id="fm" method="post" novalidate>
		
		 <div class="ftitle">角色信息</div>
         	<input name="id" type="hidden" />
         	<input id="resource_ids"  name="resource_ids" type="hidden" />
         	<input name="status" type="hidden" />
         	
            <div class="fitem">
                <label>角色编码:</label>
                <input id="role" name="role" class="easyui-textbox easyui-validatebox"   data-options="required:true">
            </div>
            <div class="fitem">
                <label>角色名称:</label>
                <input name="description" class="easyui-textbox" required="true">
            </div>
            
        <div class="ftitle">权限信息</div>
        
        <div id="resourcePanel" class="hbox"> 
        </div>
      </form>
	</div>

	<!-- 保存和关闭按钮 -->
	<div id="dlg-buttons">
		<a href="javascript:saveRole()" class="easyui-linkbutton" iconCls="icon-ok">保存</a>
		<a href="javascript:closeDialog()" class="easyui-linkbutton" iconCls="icon-cancel">关闭</a>
	</div>
	
</body>
</html>